<template>
	<view class="container">
		<u-form :model="form" ref="uForm" label-width="200rpx" :label-align="step === 1 ? 'center' : 'left'">
			<!-- ==================== 步骤一 Step 1 ==================== -->
			<view v-if="step === 1">
				<view class="form-section">
					<u-form-item label="检查部门" :border-bottom="true">
						<u-input v-model="form.department" border="none"/>
					</u-form-item>
					<u-form-item label="检查时间" :border-bottom="true">
						<u-input v-model="formattedDate" border="none"/>
					</u-form-item>
					<u-form-item label="检查地点" :border-bottom="false">
						<u-input v-model="form.location" placeholder="请输入检查地点" border="none" />
					</u-form-item>
				</view>

				<view class="section-title" @click="scanCode">
					<text style="margin-right: 10rpx;">主体基本信息</text>
					<u-icon name='/static/workspace/QR.png'></u-icon>
				</view>

				<view class="form-section">
					<u-form-item label="主体名称" :border-bottom="true">
						<u-input v-model="form.entityName" border="none" disabled placeholder="扫码后自动填充" />
					</u-form-item>
					<u-form-item label="法人" :border-bottom="true">
						<u-input v-model="form.legalPerson" border="none" disabled placeholder="扫码后自动填充" />
					</u-form-item>
					<u-form-item label="联系方式" :border-bottom="true">
						<u-input v-model="form.contact" border="none" disabled placeholder="扫码后自动填充" />
					</u-form-item>
					<u-form-item label="主体地址" :border-bottom="true">
						<u-input v-model="form.entityAddress" border="none" disabled placeholder="扫码后自动填充" />
					</u-form-item>
					<u-form-item label="检查产品" :border-bottom="false">
						<u-input v-model="form.productName" border="none" disabled placeholder="扫码后自动填充" />
					</u-form-item>
				</view>
				
				<view class="button-wrapper" v-if="scanned">
					<u-button @click="step = 2" type="success">下一步</u-button>
				</view>
			</view>

			<!-- ==================== 步骤二 Step 2 ==================== -->
			<view v-if="step === 2">
				<view class="form-section">
					<u-form-item label="检查记录照片" :border-bottom="true">
						<u-upload ref="uUpload" @on-success="onUploadSuccess"></u-upload>
					</u-form-item>
					<u-form-item label="合格证开具是否规范" :border-bottom="true">
						<u-radio-group v-model="form.isStandard">
							<u-radio name="合格">合格</u-radio>
							<u-radio name="不合格">不合格</u-radio>
						</u-radio-group>
					</u-form-item>
					<u-form-item label="是否使用禁限用农药" :border-bottom="true">
						<u-radio-group v-model="form.useBannedPesticides">
							<u-radio name="合格">合格</u-radio>
							<u-radio name="不合格">不合格</u-radio>
						</u-radio-group>
					</u-form-item>
					<u-form-item label="检查意见">
						<u-input type="textarea" v-model="form.opinion" placeholder="请输入检查意见" border="none" />
					</u-form-item>
				</view>
				<view class="button-wrapper">
					<u-button @click="submit" type="success">提交</u-button>
				</view>
			</view>
		</u-form>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				step: 1,
				scanned: false,
				form: {
					department: '成都市郫都区农业农村和林业局',
					inspectionDate: new Date().toISOString().slice(0, 10),
					location: '',
					entityName: '',
					legalPerson: '',
					contact: '',
					entityAddress: '',
					productName: '',
					photos: [],
					isStandard: '合格',
					useBannedPesticides: '合格',
					opinion: '开具规范,产品合格'
				},
			};
		},
		computed: {
			formattedDate() {
				if (!this.form.inspectionDate) return '';
				const [year, month, day] = this.form.inspectionDate.split('-');
				return `${year}年${month}月${day}日`;
			}
		},
		methods: {
			scanCode() {
				console.log('点击了“主体基本信息”，触发扫码');
				// uni.scanCode({
				// 	success: (res) => {
				// 		console.log('条码内容：' + res.result);
						// 以下为模拟数据填充
						this.form.entityName = '六六六生产主体';
						this.form.legalPerson = '六六六';
						this.form.contact = '18408248888';
						this.form.entityAddress = '郫筒街道众创空间';
						this.form.productName = '玉米';
						this.scanned = true;
						this.checkIfInspected();
				// 	}
				// });
			},
			checkIfInspected() {
				const isInspected = true; // 模拟接口返回结果
				if (isInspected) {
					uni.showModal({
						title: '提示',
						content: '该产品已被检查过，是否重新提交检查结果？',
						success: (res) => {
							if (res.confirm) {
								// TODO: 回显上一次的检查结果
							}
						}
					});
				}
			},
			onUploadSuccess(data, index, lists) {
				this.form.photos.push(data.url);
			},
			submit() {
				console.log('提交检查记录:', this.form);
				uni.showToast({
					title: '提交成功',
					icon: 'success'
				});
				setTimeout(() => {
					uni.navigateBack();
				}, 1500);
			}
		}
	};
</script>

<style lang="scss" scoped>
	.container {
		min-height: 100vh;
	}

	.form-section {
		background-color: #ffffff;
	}
	
	.section-title {
		display: inline-flex;
		width: 100%;
		justify-content: center;
		align-items: center;
		background-color: #f5f5f5;
		padding: 20rpx 30rpx;
		color: #303133;
		font-size: 28rpx;
	}

	.button-wrapper {
		padding: 30rpx;
		margin-top: auto;
	}
</style>